<template>
  <el-select
    v-model="selectVal"
    placeholder="请选择归属中心"
    :loading="loading"
    @change="handleChange"
    filterable
    clearable
  >
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
  </el-select>
</template>
<script>
import { queryItemsByDictIdService } from '@api/supplier/components';
export default {
  name: 'BelongCenterSelect', // 归属中心
  data () {
    return {
      loading: false,
      selectVal: '',
      options: [],
    };
  },
  created () {
    this.getBelongCenterData()
  },
  methods: {
    async getBelongCenterData () {
      this.loading = true
      const { result } = await queryItemsByDictIdService({ dictId: 233 })
      this.loading = false
      this.options = result.map(item => ({
        label: item.itemValue,
        value: item.id
      }));
    },
    handleChange () {
      this.$emit('input', this.selectVal);
      this.$emit('change', this.selectVal);
    },
    resetSelectVal () {
      this.selectVal = ''
    }
  }
};
</script>
